<template>
  <!-- 商品管理——批量管理 -->
  <view class="container">
    <scroll-view
      scroll-y
      style="height: 100%; width: 100%"
      @scrolltolower="onreachBottom"
    >
      <view
        class="mid-item"
        v-for="(item, index) in pageList"
        :key="index"
        :class="index == pageList.length - 1 ? 'active' : ''"
      >
        <view class="header">
          <image
            @click="selectCom(item.commodityid)"
            v-show="selectList.indexOf(item.commodityid) === -1"
            :src="Core.globalImgUrlBussiness + '/Sxy_commControl/wei@2x.png'"
          ></image>
          <image
            @click="selectCom(item.commodityid)"
            v-show="selectList.indexOf(item.commodityid) != -1"
            :src="Core.globalImgUrlBussiness + '/Sxy_commControl/yi@2x.png'"
          ></image>
        </view>
        <u-radio
          v-model="value"
          @change="radioGroupChange"
          active-color="rgb(254,210,31)"
        ></u-radio>
        <view class="guan-item boxS">
          <view class="box-top">
            <view class="box-left">
              <!-- <image></image> -->
            </view>
            <view class="box-right">
              <view class="box-name text-line2"
                >这是商品名称商品名称商品名称商 品名称</view
              >
              <view class="box-right-item">
                <view class="text-line"
                  >批发价：<text style="color: #eb5c02; font-weight: bold"
                    >3256元</text
                  ></view
                >
                <view class="text-line"
                  >零售价：<text style="color: #eb5c02; font-weight: bold"
                    >3256元</text
                  ></view
                >
              </view>
              <view class="box-right-item">
                <view class="text-line">总销量：<text>3256元</text></view>
                <view class="text-line">销售类型：<text>3256元</text></view>
              </view>
              <view class="box-right-item">
                <view class="text-line">添加人：<text>3256元</text></view>
                <view class="text-line">库存：<text>3256元</text></view>
              </view>
              <view class="box-right-item">
                <view class="text-line">上架时间：<text>3256元</text></view>
                <view></view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </scroll-view>
    <view class="footer">
      <view class="footer-left">
        <image
          @click="allSelect(show)"
          v-show="!show"
          :src="Core.globalImgUrlBussiness + '/Sxy_commControl/wei@2x.png'"
        ></image>
        <image
          @click="allSelect(show)"
          v-show="show"
          :src="Core.globalImgUrlBussiness + '/Sxy_commControl/yi@2x.png'"
        ></image>
        <u-radio
          v-model="value"
          @click="allSelect(show)"
          active-color="rgb(254,210,31)"
        >
          <text>全选</text>
        </u-radio>
      </view>
      <view class="footer-right">
        <view class="f-item" @click="showShanchu = true">删除</view>
        <view class="f-item" @click="showXiajia = true">下架</view>
      </view>
    </view>
    <scroll-view>
      <view>
        <view>
          <i-icon
            @click="selectCom(item.commodityid)"
            v-show="selectList.indexOf(item.commodityid) === -1"
            icon="icontuoyuan"
            type="single"
            size="40rpx"
            color="#999999"
          ></i-icon>
          <i-icon
            @click="selectCom(item.commodityid)"
            v-show="selectList.indexOf(item.commodityid) != -1"
            icon="icongouxuan"
            type="single"
            size="40rpx"
            color="#fbd220"
          ></i-icon>
        </view>
        <view class="guan-item boxS">
          <view class="box-top">
            <view class="box-left">
              <image></image>
            </view>
            <view class="box-right">
              <view class="box-name text-line2"
                >这是商品名称商品名称商品名称商 品名称</view
              >
              <view class="box-right-item">
                <view class="text-line"
                  >批发价：<text style="color: #eb5c02; font-weight: bold"
                    >3256元</text
                  ></view
                >
                <view class="text-line"
                  >零售价：<text style="color: #eb5c02; font-weight: bold"
                    >3256元</text
                  ></view
                >
              </view>
              <view class="box-right-item">
                <view class="text-line">总销量：<text>3256元</text></view>
                <view class="text-line">销售类型：<text>3256元</text></view>
              </view>
              <view class="box-right-item">
                <view class="text-line">添加人：<text>3256元</text></view>
                <view class="text-line">库存：<text>3256元</text></view>
              </view>
              <view class="box-right-item">
                <view class="text-line">上架时间：<text>3256元</text></view>
                <view></view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </scroll-view>
    <view class="footer">
      <view class="footer-left">
        <i-icon
          icon="icontuoyuan"
          type="single"
          size="40rpx"
          color="#999999"
        ></i-icon>
        <i-icon
          icon="icongouxuan"
          type="single"
          size="40rpx"
          color="#fbd220"
        ></i-icon>
        <text @click="allSelect(show)">全选</text>
      </view>
      <view class="footer-right">
        <view class="f-item" @click="showShanchu = true">删除</view>
        <view class="f-item" @click="showXiajia = true">下架</view>
      </view>
    </view>

    <u-modal
      v-model="showShanchu"
      :mask-close-able="true"
      title="温馨提示"
      :title-style="{ fontWeight: 'bold' }"
      :show-confirm-button="false"
    >
      <view class="slot-content" style="padding-bottom: 50rpx">
        <view class="mod-tis">是否确认删除此商品？</view>
        <view class="mod-btn">
          <view class="footerplgl" @click="showShanchu = false"> 取消 </view>
          <view class="fabucheyuan" @click="footerBtn(0)"> 确认删除 </view>
        </view>
      </view>
    </u-modal>

    <u-modal
      v-model="showXiajia"
      :mask-close-able="true"
      title="温馨提示"
      :title-style="{ fontWeight: 'bold' }"
      :show-confirm-button="false"
    >
      <view class="slot-content" style="padding-bottom: 50rpx">
        <view class="mod-tis">是否确认下架此商品？</view>
        <view class="mod-btn">
          <view class="footerplgl" @click="showXiajia = false"> 取消 </view>
          <view class="fabucheyuan" @click="footerBtn(1)"> 确认下架 </view>
        </view>
      </view>
    </u-modal>
  </view>
</template>

<script src="./batchAdmin.js"></script>
<style lang="scss" scoped>
@import "./batchAdmin.scss";
</style>
